//搜索框提示
// $(".search_box input").focus(function(){
//     $(".search_box .tip_a").removeClass("tip_a").addClass("tip") 
//     $(document).click(function(){
//         $(".search_box .tip").removeClass("tip").addClass("tip_a") 
//     })
// })


$(".ibar_mp_foot li").eq(2).click(function(){
    $(window).scrollTop(0)
})
//搜索框提示
$(".search_box input").click(function(event){
    event.stopPropagation()
    $(".search_box .tip_a").removeClass("tip_a").addClass("tip")  
})
$(document).click(function(){
    $(".search_box .tip").removeClass("tip").addClass("tip_a") 
})
//搜索框下拉列表移入样式
$(".tip_a li").mouseenter(function(){
    $(this).addClass("active").siblings().removeClass("active")
})
$(".tip_a li").click(function(){
    $(".search_box input").val($(this).find("span").html()) 
})
//鼠标移入，弹出登录框
$(".ibar_mp_center li").eq(0).hover(function(){
 $(".ibar_mp_center .login_box").css("display","block") 
},function(){
    $(".ibar_mp_center .login_box").css("display","none") 
})
//登陆区
$(".ibar_mp_center .login_box .close").click(function(event){
    // event.stopPropagation()
    $(".ibar_mp_center .login_box").css("display","none") 
})


//打开页面弹出右边导航栏
$(function(){
    $(".fixaside").css("right","0")
})
//点击弹出购物车
$(".ibar_mp_center li .tw").click(function(event){
    event.stopPropagation()
    $(".ibar_mp_carlist").animate({
        left:-287,
    })
    $(this).addClass("active")
})
//点击页面关闭购物车，取消样式
$(document).click(function(){
    $(".ibar_mp_carlist").animate({
        left:40,
    })
    $(".ibar_mp_center li .tw").removeClass("active") 
})
//利用冒泡抵消点击弹出的购物车关闭现象
$(".ibar_mp_carlist").click(function(event){
    event.stopPropagation()
    $(this).animate({
        left:-287,
    })
    $(".ibar_mp_center li .tw").addClass("active")
    console.log("弹出")
})
//点击叉号关闭
$(".ibar_mp_carlist h2 .close").click(function(event){
    event.stopPropagation()
    
    $(".ibar_mp_carlist").animate({
        left:40,
    })
    $(".ibar_mp_center li .tw").removeClass("active") 
})                                 





//当滚动到一定位置，左侧按钮出现
window.onscroll=function(){
    if($(window).scrollTop()>=576){
        $(".home_nav_bar").css("display","block")
    }else{
        $(".home_nav_bar").css("display","none")
    }
}

//从接口传入商品
productLoad()
async function productLoad(){
    if(localStorage.getItem("uid")){
        var {data} =  await axios.get(productAPI,{
            params:{
                uid:localStorage.getItem("uid"),
            }
        })
    }else{
        var {data} =  await axios.get(allproductlistAPI)
    }
 
 console.log(data)
     var html=""
    data.data.forEach(function(v,i){
        html=html+`
        <li>
        <div class="imgbox">
            <a href="detail.html?pid=${v.pid}">
                <img src=${v.pimg} alt="">
            </a>
        </div>
        <div class="join">
            <a href="javascript:;">加入购物车</a>
            <ul class="details">
                <li>${v.pname}*3盒</li>
                <li>${v.pname}*3盒</li>
            </ul>
        </div>
        <div class="desc">
            <p class="desc_item">${v.pdesc}</p>
            <p class="price"><span>￥</span>${v.pprice}</p>
        </div>
    </li>
        `
    })
    $(".product_list .items_list").html(html)
   //给主页商品列表添加购物车按钮增加点击事件
$("li .join a").click(function(){
    $(this).next().css("display","block")
})
//购物车按钮消失时列表隐藏
$(".items_list li").mouseleave(function(){
    $(this).find(".join .details").css("display","none")
})
  
}
//当页面滚动到一定距离，回到顶部按钮出现
window.onscroll=function(){
  if($(window).scrollTop()>300){
      $(".ibar_mp_foot li").eq(2).css("visibility","visible")
      console.log(1)
  }else{
    $(".ibar_mp_foot li").eq(2).css("visibility","hidden")
  }
}
//同步更新购物车数量与内容
updataCart()
async function updataCart(){
    if(localStorage.getItem("uid")){
        $(".fixaside .ibar_mp_carlist .carlist_empty").height(0)
        var {data} = await axios.get(carlistAPI,{
            params:{
                id:localStorage.getItem("uid"),
            }
        })
        console.log(data.data)
        var sum =0;
        var count=0;
        var html=""
        var html0 = `
        <h2>名品特卖</h2>
        <hr>
        `
        data.data.forEach(function(v,i){
           sum = sum+parseInt(v.pnum);
           count = count+parseInt(v.pprice)*parseInt(v.pnum)
           html=html+`
                  <ul class=" cart_list">
                      <li class="clearfix">
                          <div class="l">
                             <img src=${v.pimg} alt="">
                          </div>
                          <div class="r">
                              <p class="name">${v.pname}</p>
                              <p class="desc">${v.pdesc}</p>
                              <p class="mn"><span>￥${v.pprice}</span>×<i>${v.pnum}</i></p>
                          </div>
     
                      </li>
                  </ul>
                  <hr>
           `
        })
        console.log(html)
        var html3 = `
        <p><span class="s1">共<i>${sum}</i>件商品</span><span class="s2">￥${count}</span></p>
        <a href="../html/cart.html" class="to_pay">去购物车结算</a>
        `
        $(".fixaside .ibar_mp_carlist .carlist").html(html0+html+html3)
       $(".fixaside .outer .num").html(sum)
    }else{
$(".fixaside .ibar_mp_carlist .carlist_empty").height(375)
    }
  
}
